<template>
	<div style="position: relative;">
		<!-- <div v-if="myAccount.accountStatus === 4 && myAccount.vendorStatus && myAccount.vendorStatus != '2'" class="info_bg">
			<div class="info">因您的工行电子账号存异常，已被工行冻结，请及时到工行处理或联系众茶国际(400-0629-666)协助处理。期间您的资金仍存放在工行，监管账号解冻后将继续使用。</div>
		</div> -->
    <!-- 工行注册 -->
    <ICBCInfo :ICBCtype="ICBCtype" v-if="showICBCInfo" @reloadUI='reloadUI'></ICBCInfo>
		<!-- 账户详情 -->
		<template v-else>
		  <account-detail :totalAccount="myAccount" @getAccount="platInfo"></account-detail>
		</template>
	</div>
</template>

<script>
	import {mapGetters} from 'vuex'
	import { getPlatInfo } from '@/api/user'
	import AccountDetail from './AccountDetail'
  import ICBCInfo from './ICBCInfo'

	export default { 
		components: {
			AccountDetail,
      ICBCInfo
		},
		data() {
			return {
        myAccount:{},
        loading:true,
        ICBCtype:1,
				showICBCInfo: true
			}
		},
		computed: {
			...mapGetters(['userInfo']),
		},
		created() {
      this.platInfo()
		},
		methods: {
      // 账户信息
			platInfo() {
        this.loading = true

				const loading = this.$loading();

				getPlatInfo().then(response => {
					loading.close();
					console.log('account', response)
					this.myAccount = response || {};
					if (this.myAccount.accountStatus === -1) {
						this.showICBCInfo = true
					} else if (JSON.stringify(this.myAccount) == '{}') {
						this.showICBCInfo = true
					} else {
						this.showICBCInfo = false
					}
				}).catch(error => {
					console.log(error);
					loading.close();
				})
			},
			reloadUI() {
				this.platInfo()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.flexInput {
		display: flex;
		width: 100%;

		.el-input {
			width: auto;
			flex: 1;
		}
	}

	.info_bg {
		position: fixed;
		display: flex;
		// align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		background-color: rgba($color: black, $alpha: 0.5);
		z-index: 100;

		.info {
			margin-top: 160px;
			padding: 20px;
			width: 360px;
			height: 130px;
			border-radius: 8px;
			background-color: white;
		}
	}
</style>
